<template>
  <div class="content" :style="{top:noticeBarHeight+'px'}">
<!--     -->
    <van-notice-bar :scrollable="false" left-icon="volume-o" background="rgba(255,255,255,0.5)"  color="#fff">
      <van-swipe
          :autoplay="1500"
          :show-indicators="false"
          class="notice-swipe"
          vertical
      >
        <van-swipe-item class="van-swipe-item-text" v-for="(item,index) in refundNotice" :key="index">
          用户{{ item ? item.usernum : '' }}刚刚放款{{ item ? item.loanMoney : '' }}万元
<!--          <div class="">-->
<!--            <div>内容 1</div>-->
<!--            <div>2分钟前</div>-->
<!--          </div>-->
          </van-swipe-item>
      </van-swipe>
    </van-notice-bar>
    </div>

</template>

<script>
export default {
  name: "notice-bar",
  data(){
    return{
      refundNotice:[],
      noticeBarHeight:'',
    }
  },
  mounted() {
    this.noticeBarHeight=(document.body.clientWidth)/375*600;
    this.getRefundNotice();
  },
  methods:{
    //获取放款通知
    getRefundNotice() {
      this.$axios.get('/html/apply/loanNotice').then(res => {
        this.refundNotice = res.data.data;
      })
    },
  },
}
</script>
<style>
.van-notice-bar{
  height: 30px;
  border-radius: 2px;
}
.notice-swipe {
  height: 30px;
  line-height: 30px;
}
.van-notice-bar__content.van-ellipsis{
  width: 100%;

}

</style>

<style scoped>
.content {
  padding: 0 15px;
  position: absolute;
  left: 0;
  top: 597px;
  z-index: 999;
  right: 0;
}
.van-swipe-item-text{
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

</style>